<template>
  <div class="editIcon">
    <iconCard
      v-for="item in list"
      :key="item.type"
      :title="item.title"
      :subTitle="item.subTitle"
      :listData="item.data"
      :iconCls="item.iconStyleCls"
      :isShowIcon="isShowIcon"
      @iconClickFun="iconClickFun"
      :type="item.type"
      ref="iconCard"
    ></iconCard>
  </div>
</template>

<script>
import iconCard from "./components/iconCard";
export default {
  props: {
    list: {
      type: Array,
      default: () => []
    }
  },
  components: {
    iconCard
  },
  data () {
    return {

      isShowIcon: false
    };
  },
  methods: {
    // 点击我的应用
    setMyDataFun (item) {
      let index = this.list[0].data.findIndex(v => v.menuId === item.menuId);
      if (index > -1) {
        this.list[0].data.splice(index, 1);
      }
    },
    // 点击全部应用
    setAllDataFun (item) {
      // this.exChangeDataFun(item, "all");
      let isHaveId = this.list[0].data.some(v => v.menuId === item.menuId); // 判断是否存在与常用功能中
      if (isHaveId) {
        this.$message({
          message: "请不要重复添加",
          type: "warning"
        });
      } else {
        this.list[0].data.push(item);
      }
    },
    // exChangeDataFun (item, type) {
    //   let currentList = this.list.find(v => v.type === type);
    //   let targetType = type === "my" ? "all" : "my";
    //   let targetList = this.list.find(v => v.type === targetType);
    //   if (Object.keys(currentList).length === 0) {
    //     return;
    //   }
    //   let currentData = currentList.data;
    //   let targetData = targetList.data;
    //   let index = currentData.findIndex(v => v.id === item.id);
    //   if (index < 0) {
    //     return;
    //   }
    //   currentData.splice(index, 1);
    //   item.type = targetType;
    //   targetData.push(item);
    // },
    setIsShowIcon (flag) {
      this.isShowIcon = flag;
    },
    iconClickFun (item, type) {
      let map = {
        my: this.setMyDataFun,
        all: this.setAllDataFun
      };
      map[type](item);
    },
    getDataFun () {
      return this.$refs.iconCard.end();
    }
  }
};
</script>

<style lang="less" scoped>
.editIcon {
  height: 100%;
}
</style>